import Vue from 'vue'
import App from './App.vue'
// 导入路由
import router from './router'
import store from './store'
// 1.1导入axios
import axios from 'axios'
// 1.2 设置axios的请求跟路径
axios.defaults.baseURL = 'http://big-event-vue-api-t.itheima.net'

// 请求添加拦截器
//   -config  获取请求对象的信息
axios.interceptors.request.use(function (config) {
  console.log('所有的正常的请求在到达服务器之前都会经过这里', config);
  const token = store.state.token
  if (token) {
    config.headers.Authorization = store.state.token
  }
  // config  一定要return  返回出去,去服务器
  return config
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error)
})
// 1.3 把axios挂载到Vue.prototype上
// Vue.prototype

// 添加路由守卫
// beforEach:页面跳转之前都会经过这里
// 声明一个白名单列表
const whiteList = ['/reg', '/login']

router.beforeEach((to, from, next) => {
  // next()    //放行,继续跳转   ||  next(指定要跳转页面的路径)    next('/login')
  console.log('页面跳转之前都会经过这里');
  // to  去哪里的对象信息
  console.log('to:去哪里', to.path);
  console.log('from:从哪儿来', from.path);

  // 1 判断是否有token,声明一个变量接收token
  const token = store.state.token
  if (token) {
    // 有token,已经登录
    console.log('有token,已经登录');
    //2 判断是否去登录页
    if (to.path === '/login') {
      console.log('已经登录,直接去首页');
      next('/')
    } else {
      console.log('放行');
      next()
    }
  } else {
    // 没有token,没有登录
    console.log('没有token,没有登录');
    //3 判断是否去白名单(不需要权限的登录页和注册页)
    if (whiteList.includes(to.path)) {
      console.log('有白名单,放行');
      next()
    } else {
      console.log('没有白名单,请先登录');
      next('/login')
    }
  }
})

Vue.prototype.$http = axios

// 2.1导入elementui组件
import ElementUI from 'element-ui'
// 2.2引入elementui样式
import 'element-ui/lib/theme-chalk/index.css'

// 3.1导入CSS全局样式
import '@/assets/global.less'

Vue.config.productionTip = false

// 2.3注册elementui
Vue.use(ElementUI)

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')
